<template>
	<view>
		<view class="type1" @click="funConnectBluetooth">我的智能</view>
		
		<view>
			<view class="style13">{{getTempData}}</view>
			<view class="style14">温度(℃)</view>
			<view class="style15">{{getHumData}}</view>
			<view class="style16">湿度(%)</view>
		</view>
		
		<view>
			<view class="style13">{{getWei}}</view>
			<view class="style14">重量(g</view>
			<view class="style15">{{getLen}}</view>
			<view class="style16">距离(cm)</view>
		</view>
		
		
		
		
		<view class="type4" @click="updateNotify">温度</view>
		<view class="type3" @click="gotoZhexian"> 
			<view class="type5">
				<view class="type6">H</view>
				<view class="type7">目标温度{{setTempData}}℃</view>
				<view class="type8">温度设置值</view>
				<view class="type11">
					<button @click="sendButtonTem">发送</button>
				</view>
			</view>
		</view>
		<view class="type12">
			<slider value="30" @change="sliderChangeTemp"  min="0" max="50" show-value />
		</view>
		
		
		<view class="type4" @click="updateNotify">湿度</view>
		<view class="type3" @click="gotoZhexian"> 
			<view class="type5">
				<view class="type6">C</view>
				<view class="type7">目标湿度{{setHumData}}%</view>
				<view class="type8">湿度设置值</view>
				<view class="type11">
					<button @click="sendButtonHum">发送</button>
				</view>
			</view>
		</view>
		<view class="type12">
			<slider value="50" @change="sliderChangeHum"  min="10" max="100" show-value />
		</view>
		
		
		<view class="type4" @click="updateNotify">距离</view>
		<view class="type3" @click="gotoZhexian"> 
			<view class="type5">
				<view class="type6">C</view>
				<view class="type7">目标距离{{setLenData}}cm</view>
				<view class="type8">距离设置值</view>
				<view class="type11">
					<button @click="sendButtonLen">发送</button>
				</view>
			</view>
		</view>
		<view class="type12">
			<slider value="100" @change="sliderChangeLen"  min="100" max="500" show-value />
		</view>
		
		
		<view class="type4" @click="updateNotify">重量</view>
		<view class="type3" @click="gotoZhexian"> 
			<view class="type5">
				<view class="type6">C</view>
				<view class="type7">目标重量{{setWeiData}}g</view>
				<view class="type8">重量设置值</view>
				<view class="type11">
					<button @click="sendButtonWei">发送</button>
				</view>
			</view>
		</view>
		<view class="type12">
			<slider value="110" @change="sliderChangeWei"  min="100" max="500" show-value />
		</view>
		
		<view> * 注意：请勿重复点击</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				timer: null,  // 定时器
				getTempData:0,
				getHumData:0,
				getWei:0,
				getLen:0,
				
				setTempData:30,
				setHumData:50,
				setLenData:100,
				setWeiData:110,
 			}
		},
		
		onLoad() {
			let that = this

			// 定时器周期执行
			this.timer = setInterval(function() {
				that.refreshData();
			}, 300)
		},
		
		methods: {
			refreshData() {
				let that = this
				that.getTempData = getApp().globalData.dataTemp;
				that.getHumData = getApp().globalData.dataHum;
				that.getWei = getApp().globalData.dataWeight;
				that.getLen = getApp().globalData.dataDistance;
			},
			
			
			sliderChangeTemp(e) {
				let that = this
				console.log(e.detail.value)
				this.setTempData = e.detail.value
			},
			
			sliderChangeHum(e) {
				let that = this
				console.log(e.detail.value)
				this.setHumData = e.detail.value
			},
			
			sliderChangeWei(e) {
				let that = this
				console.log(e.detail.value)
				this.setWeiData = e.detail.value
			},
			
			sliderChangeLen(e) {
				let that = this
				console.log(e.detail.value)
				this.setLenData = e.detail.value
			},
			
			

			sendButtonTem(e) {
				let that = this;
				console.log("设置数据！",this.setTempData)
				that.funSandBleMessage(1, this.setTempData);
			},
			
			sendButtonHum(e) {
				let that = this;
				console.log("设置数据！",this.setHumData)
				that.funSandBleMessage(2, this.setHumData);
			},
			
			sendButtonLen(e) {
				let that = this;
				console.log("设置数据！",this.setLenData)
				that.funSandBleMessage(3, this.setLenData);
			},
			
			sendButtonWei(e) {
				let that = this;
				console.log("设置数据！",this.setWeiData)
				that.funSandBleMessage(4, this.setWeiData);
			},
			
			funSandBleMessage(type, data) {
				
				const buffer = new ArrayBuffer(7) //分配1个字节的连续内存区域。
				const dataView = new DataView(buffer)
				
				if (type == 1) {
					dataView.setUint8(0, 0x44)
					dataView.setUint8(1, 0x44)
					dataView.setUint8(2, 0x54)
					dataView.setUint8(3, 0x30+(data / 10 %10))
					dataView.setUint8(4, 0x30+(data / 1  %10))
					dataView.setUint8(5, 0x0D)
					dataView.setUint8(6, 0x0A)
				}
				if (type == 2) {
					dataView.setUint8(0, 0x44)
					dataView.setUint8(1, 0x44)
					dataView.setUint8(2, 0x48)
					dataView.setUint8(3, 0x30+(data / 10 %10))
					dataView.setUint8(4, 0x30+(data / 1  %10))
					dataView.setUint8(5, 0x0D)
					dataView.setUint8(6, 0x0A)
				}
				if (type == 3) {
					dataView.setUint8(0, 0x44)
					dataView.setUint8(1, 0x4C)
					dataView.setUint8(2, 0x30+(data / 100 %10))
					dataView.setUint8(3, 0x30+(data / 10 %10))
					dataView.setUint8(4, 0x30+(data / 1  %10))
					dataView.setUint8(5, 0x0D)
					dataView.setUint8(6, 0x0A)
				}
				if (type == 4) { // 关闭制冷
					dataView.setUint8(0, 0x44)
					dataView.setUint8(1, 0x57)
					dataView.setUint8(2, 0x30+(data / 100 %10))
					dataView.setUint8(3, 0x30+(data / 10 %10))
					dataView.setUint8(4, 0x30+(data / 1  %10))					
					dataView.setUint8(5, 0x0D)
					dataView.setUint8(6, 0x0A)
				}
				console.log("发送数据:", buffer)
				
				//改变指定服务属性的uuid数值
				uni.writeBLECharacteristicValue({
				  // 这里的 deviceId 需要在 getBluetoothDevices 或 onBluetoothDeviceFound 接口中获取
				  deviceId: getApp().globalData.dataDeviceID,
				  // 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
				  serviceId:"0000FFF0-0000-1000-8000-00805F9B34FB",
				  // 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
				  characteristicId:"0000FFF1-0000-1000-8000-00805F9B34FB",
				  // 这里的value是ArrayBuffer类型
				  value: buffer,
				  success(res) {
					console.log('writeBLECharacteristicValue success', res.errMsg)
					
				  },
				  
				  fail(res) {
					 console.log(res)
					 uni.hideLoading();
					 uni.showModal({
						 title: '提示',
						 content: '传输失败',
						 success: function (res) {
							 if (res.confirm) {
								 console.log('确定');
							 }
						 }
					 });
				  }
				})
			},
		}
	}
</script>

<style>
	.type1 {
		font-size: 20px; 
		margin-left:3%;
	}
	
	.type2 {
		font-size: 20px;
		color: #656565;
		margin-left:3%;
	}
	
	.type3 {
		display: flex;
		justify-content: center; /* 水平居中 */
		height: 80px;
	}
	
	.type4 {
		font-size: 15px;
		color: #656565;
		margin-top: 40px;
		margin-left: 5%;
	}
	
	.type5 {
		border-radius: 15px;  /* 统一圆角 */
		background: #ffffff;  /* 背景色或边框 */
		width: 92%; 
		height: 92px;
		margin-top: 1%;
		margin-left: 0%;	
	}
	
	.type6 {
		display: flex;
		font-size: 35px;
		border-radius: 15px;  /* 统一圆角 */
		width: 50px; 
		height: 50px;
		justify-content: center; /* 水平居中 */
		color: #eaeaea;
		background-color: #ffc081;
		margin-top: 20px;
		margin-left: 20px;
	}
	
	.type7 {
		font-size: 17px; 
		margin-left: 85px;
		margin-top: -45px;
	}
	
	.type8 {
		font-size: 15px; 
		margin-left: 85px;
		margin-top: 0px;
		color: #969696;
	}
	
	.type9 {
		font-size: 210%;
		margin-left: 70%;
		margin-top: -12%;
		color: #000000;
	}
	
	.type10 {
		font-size: 120%;
		margin-left: 82%;
		margin-top: -9%;
		color: #969696;
	}
	
	/* .type11 {
		margin-left: 80%;
		margin-top: -50px;
	} */
	
	.type11 {
		width: 70px; 
		margin-left: 73%;
		margin-top: -50px;
	}
	
	.type12{
		margin-top: 40px;
	}
	
	.style13 {
		font-size: 210%;
		margin-top: 40px;
		margin-left: 20%;
	}
	
	.style14 {
		margin-top: 20px;
		margin-left: 20%;
	}
	
	.style15 {
		font-size: 210%;
		margin-top: -85px;
		margin-left: 70%;
	}
	
	.style16 {
		margin-top: 20px;
		margin-left: 70%;
	}
</style>
